<template>
  <div class="editCourseInfo" style="padding: 10px;">
    <el-card >
      <div style="padding: 0 20px 300px 20px;">
        <el-button type="primary" @click="saveEdit">保存</el-button>
        <!-- <p @click="saveEdit">保存</p> -->
        <p style="margin-top: 30px;margin-bottom: 10px; color: 999;">青少年级别管理</p>
        <p style="font-size: 30px;margin-bottom: 20px;">{{ className }}</p>
        <p style="font-weight: 600; border-bottom: 1px solid rgba(153, 153, 153, 0.5); padding-bottom: 8px;">基本信息</p>
        <div style="display: flex; margin-top: 12px;">
          <p style="margin-right: 20px; font-size: 14px; font-weight: 600;line-height: 40px;">负责人</p>
          <el-select v-model="teacher_id" placeholder="请选择">
            <el-option
              v-for="item in teachers"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </div>
      </div>
      
    </el-card>
    
  </div>
</template>

<script>
import http from '@/api/classlist'

export default {
  name: 'editCourseInfo',
  data () {
    return {
      http: http,
      teachers: [],
      teacher_id: '',
      className: '',
      classId: ''
    }
  },
  methods: {
    saveEdit () {
      let params = {
        name: this.className,
        id: this.classId,
        teacher_id: this.teacher_id
      }
      http.editClass(params).then(res => {
        this.$message.success(res.msg || '修改成功')
        this.$router.push('./manage')
      })
    }
  },
  mounted () {
    let params = {
      id: this.$route.query.id
    }
    let params1 = {
      teacher: this.$route.query.id
    }
    http.getDetailInfo(params).then(res => {
      this.className = res.data.name
      this.teacher_id = res.data.teacher_id
      this.classId = res.data.id
    })
    http.getAllTeacher().then(res => {
      this.teachers = res.data
    })
  }
}
</script>

<style lang="scss" scoped>
  .c{
    color: rgb(153, 153, 153)
  }
</style>